//
// DISCLAIMER:
// Do not change this file because it is core styling.
// Customizing core files will make updating Atlas much more difficult in the future.
// To customize any core styling, copy the part you want to customize to styles/web/sass/app/ so the core styling is overwritten.
//

@mixin table-helpers() {
    /* ==========================================================================
       Table

    //== Design Properties
    //## Helper classes to change the look and feel of the component
    ========================================================================== */
    // Lined
    table.table-lined.mx-table {
        > tbody {
            // Table row
            > tr {
                // Table header
                // Table data
                > td {
                    border-width: 1px 0;
                    border-style: solid;
                    border-color: $grid-border-color;
                }
            }
        }
    }

    // Bordered
    table.table-bordered.mx-table {
        > tbody {
            // Table row
            > tr {
                // Table header
                // Table data
                > th,
                > td {
                    border-width: 1px;
                    border-style: solid;
                    border-color: $grid-border-color;
                }
            }
        }
    }

    // Makes table compact
    table.table-compact.mx-table {
        > tbody {
            // Table row
            > tr {
                // Table header
                // Table data
                > th,
                > td {
                    padding-top: 2px;
                    padding-bottom: 2px;
                }
            }
        }
    }

    // Tables Vertical
    // Will remove unwanted paddings
    table.table-vertical.mx-table {
        > tbody {
            // Table row
            > tr {
                // Table header
                > th {
                    padding-bottom: 0;

                    > label {
                        padding: 0;
                    }

                    > div > label {
                        padding: 0;
                    }
                }
            }
        }
    }

    // Align content in middle
    table.table-align-vertical-middle.mx-table {
        > tbody {
            // Table row
            > tr {
                // Table header
                // Table data
                > th,
                > td {
                    vertical-align: middle;
                }
            }
        }
    }

    // Compact labels
    table.table-label-compact.mx-table {
        > tbody {
            // Table row
            > tr {
                // Table header
                // Table data
                > th,
                > td {
                    > label {
                        margin: 0;
                        padding: 0;
                    }

                    > div > label,
                    .mx-referenceselector-input-wrapper label {
                        margin: 0;
                        padding: 0;
                    }
                }
            }
        }
    }

    $height-row-s: 55px;
    $height-row-m: 70px;
    $height-row-l: 120px;
    // Small rows
    table.table-row-s.mx-table {
        > tbody {
            // Table row
            > tr {
                // Table header
                // Table data
                > th,
                > td {
                    height: $height-row-s;
                }
            }
        }
    }

    // Medium rows
    table.table-row-m.mx-table {
        > tbody {
            // Table row
            > tr {
                // Table header
                // Table data
                > th,
                > td {
                    height: $height-row-m;
                }
            }
        }
    }

    // Large rows
    table.table-row-l.mx-table {
        > tbody {
            // Table row
            > tr {
                // Table header
                // Table data
                > th,
                > td {
                    height: $height-row-l;
                }
            }
        }
    }

    // Makes the columns fixed
    table.table-fixed {
        table-layout: fixed;
    }
}
